<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <base th:href="@{/}">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
    <title></title>
    <link rel="stylesheet"  type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="css/hsycmsAlert.css">
    <link rel="stylesheet" type="text/css" href="css/login.css">
    <link rel="stylesheet" type="text/css" href="easyui/1.3.4/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="css/icon.css">

</head>

<body>
<!--普通弹窗-->
<div class="hsycms-model-mask" id="mask-alert"></div>
<div class="hsycms-model hsycms-model-alert" id="alert">
    <div class="hscysm-model-title">温馨提示</div>
    <div class="hsycms-model-text">这里是内容</div>
    <div class="hsycms-model-btn"><button type="button">确定</button></div>
</div>

<div class="limiter">
    <div class="container-login100 bg-img">
        <div class="wrap-login100 p-l-55 p-r-55 p-t-65 p-b-75">
            <form id="login_form" class="login100-form">
                <span class="login100-form-title p-b-49">
                    <img class="sxh" src="images/xh.jpg" alt="校徽">
                    <span class="g-title">成绩管理系统</span>
                </span>

                <div class="wrap-input100 m-b-23">
                    <label for="username"></label>
                    <input id="username" class="input100" type="text" name="username" placeholder="请输入18位身份证号" />
                    <i class="fa fa-user fa-lg icon"></i>
                </div>

                <div class="wrap-input100 m-b-23">
                    <label for="password"></label><input id="password" class="input100" type="password" name="password" placeholder="请输入密码"/>
                    <i class="fa fa-lock fa-lg icon"></i>
                </div>

                <div class="wrap-input100 m-b-23">
                    <label for="yzm_input"></label>
                    <input id="yzm_input" class="input100" name="vcode" type="text" placeholder="请输入验证码"   style="width: 200px;"/>
                    <i class="fa fa-unlock-alt icon"></i>
                    <img class="code_img" title="点击图片切换验证码" id="code_img" src="get_cpacha?vl=4&w=160&h=50" alt="验证码">
                </div>

                <div class="radio-type">
                    <span class="span-left"><input id="span_left" type="radio" name="usertype" value="管理员"><label for="span_left">管理员</label></span>
                    <span class="span-center"><input id="span_center" type="radio" name="usertype" value="教师"><label for="span_center">教师</label></span>
                    <span class="span-right"><input id="span_right" type="radio" name="usertype" value="学生"><label for="span_right">学生</label></span>
                </div>
                <div class="p-t-8 p-b-31"></div>

                <div class="">
                    <input type="text" name="url_action" id="url_action" hidden="hidden" value="">
                    <div class=""></div>
                    <input type="button" id="login_btn" class="login100-form-btn" value="登录"/>
                </div>
            </form>
        </div>
    </div>
</div>

<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/hsycmsAlert.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {

        //点击图片切换验证码
        $("#code_img").on("click",function () {
            this.src = "get_cpacha?vl=4&w=160&h=50&t=" + new Date().getTime();
        });
        //按回车键提交表单登录
        $("#yzm_input").on("keydown",function (e) {
            if(e.keyCode==13){
                $("#submitBtn").click();
            }
        });

        //登录 根据界面选择 动态设置跳转路径 url_action
        $("#login_btn").on("click",function () {
            let usertype=$("input[name='usertype']:checked").val();
            let url_action = $("#url_action");
            if("管理员"==usertype){
                url_action.val("adminindex");
            }else if("教师"==usertype){
                url_action.val("teacherindex");
            }else if("学生"==usertype){
                url_action.val("studentindex");
            }else{
                //用户登录没有选择类型
                if (usertype == undefined) {
                    hsycms.alert('alert', "管理员、教师或学生 请选其一", function () {
                        hsycms.close('alert');
                    });
                    return false;
                }
            }
            //用户登录没有选择类型
            if(url_action.val()==""){
                hsycms.alert('alert', "管理员、教师或学生 请选其一！", function () {
                    hsycms.close('alert');
                });
                return false;
            }
            let data = $("#login_form").serialize();
            $.ajax({
                type: "post",
                url: "login",
                data: data,
                dataType: "json",                                                                   //返回数据类型
                success: function (data) {
                    if ("success" == data.type) {
                        window.parent.location.href = data.userindex;                      //跳转到系统首页
                    } else {
                        hsycms.alert('alert', data.msg, function () {
                            $("#code_img").click();                         //切换验证码
                            $("input[name='vcode']").val("");       //清空验证码输入框
                            hsycms.close('alert');
                        });
                        return false;
                    }
                }
            });


        });


    });
</script>

</body>
</html>